import { Scene } from "phaser";
import backgroundImg from "../images/background.jpg";
import enemyImg from "../images/enemy.png";
import playerImg from "../images/player.png";
import bulletImg from "../images/bullet.png";
import boomImg from "../images/boom.png";
import spritesImg from "../images/sprites.png";
import spritesJson from "../json/sprites.json?url";
import bgmAudio from "../audio/bgm.mp3";
import boomAudio from "../audio/boom.mp3";
import bulletAudio from "../audio/bullet.mp3";

export class Preloader extends Scene {
    constructor() {
        super("Preloader");
    }
    preload() {
        // 加载图片
        this.load.image("background", backgroundImg);
        this.load.image("enemy", enemyImg);
        this.load.image("player", playerImg);
        this.load.image("bullet", bulletImg);
        this.load.spritesheet("boom", boomImg, {
            frameWidth: 64,
            frameHeight: 48,
        });
        this.load.atlas("sprites", spritesImg, spritesJson);

        // 加载音频
        this.load.audio("bgm", bgmAudio);
        this.load.audio("boom", boomAudio);
        this.load.audio("bullet", bulletAudio);
    }
    create() {
        const { width, height } = this.cameras.main;
        // 背景
        this.add.tileSprite(0, 0, width, height, "background").setOrigin(0, 0);
        // 背景音乐
        this.sound.play("bgm");

        // 标题
        this.add
            .text(width / 2, height / 4, "飞机大战", {
                fontFamily: "Arial",
                fontSize: 60,
                color: "#e3f2ed",
                stroke: "#203c5b",
                strokeThickness: 6,
            })
            .setOrigin(0.5);

        // 开始按钮
        let button = this.add
            .image(width / 2, (height / 4) * 3, "sprites", "button")
            .setScale(3, 2)
            .setInteractive()
            .on("pointerdown", () => {
                // 点击事件：关闭当前场景，打开Main场景
                this.scene.start("Main");
            });

        // 按钮文案
        this.add
            .text(button.x, button.y, "开始游戏", {
                fontFamily: "Arial",
                fontSize: 20,
                color: "#e3f2ed",
            })
            .setOrigin(0.5);

        // 创建动画，命名为 boom，后面使用
        this.anims.create({
            key: "boom",
            frames: this.anims.generateFrameNumbers("boom", { start: 0, end: 18 }),
            repeat: 0,
        });
    }
}
